<template>
  <div>
    <!-- 头部 -->
    <hmhead title="传智播客 黑马程序员"></hmhead>
    <!--//轮播  -->
    <van-swipe
      class="my-swipe"
      :autoplay="3000"
      indicator-color="white"
      style="margin-top: 5px"
    >
      <van-swipe-item v-for="(item, index) in lunimg" :key="index"
        ><img class="lunimg" :src="item.img" alt="" />
      </van-swipe-item>
    </van-swipe>
    <!-- 列表 -->
   <van-grid class="icon" :border="false" :column-num="3">
  <van-grid-item @click="$router.push({name:'Newslist'})">
    <van-icon name="location-o"  color="#1fd49a" size="30" />
    <span>新闻资讯</span>
  </van-grid-item>
 <van-grid-item to="/photoSharing">
        <van-icon name="share-o" color="#fd3c4f" size="35" />
    <span>图片分享</span>
  </van-grid-item>
  <van-grid-item to="/getgoods">
        <van-icon name="cart-circle-o" color="#3f80fe" size="35" />
    <span>商品展示</span>
  </van-grid-item>
  <van-grid-item>
        <van-icon name="records" color="#ee0a24" size="35" />
    <span>留言反馈</span>
  </van-grid-item>
  <van-grid-item>
    <van-icon name="description" color="#fd4000" size="35"  />
    <span>搜索咨询</span>
  </van-grid-item>
  <van-grid-item>
    <van-icon name="comment-o" color="#1989fa"  size="35" />
    <span>联系我们</span>
  </van-grid-item>
</van-grid>

 <router-view></router-view>
  </div>
</template>

<script>
import hmhead from "@/component/hm-head.vue";
import { lunbo } from "@/api/getlunbo";
export default {
  components: {
    hmhead,
  },
  data() {
    return {
      lunimg: [],
    };
  },
  mounted() {
    lunbo().then((res) => {
      // console.log(res);
      this.lunimg = res.data.message;
      // console.log(this.lunimg);
    });
  },
};
</script>

<style lang="less" scoped>
.lunimg {
  width: 100%;
  background-size: cover;
    
}
.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  line-height: 150px;
  text-align: center;
  background-color: #39a9ed;
}
.my-swipe .van-swipe-item {
  line-height: 0px;
  background-color: #fff;
}
.icon{
  .van-icon{
    padding-bottom: 20px;
  }
}
</style>
